

<template>

    <el-form ref="knowledgeUpdateFormRef" :model="props.knowledgeForm" :class="form-item" :rules="rules" :size="size" status-icon>
      <el-row>
        <el-col :span="7">
          
          <el-form-item class="form-item" prop="title" label="知识标题：" label-width="80px">
            <el-input v-model="props.knowledgeForm.value.title" autocomplete="off"/>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item class="form-item" prop="content" label="知识概述：" label-width="100px">
            <el-input v-model="props.knowledgeForm.value.content" autocomplete="off" />
          </el-form-item>
        </el-col>
        <el-col :span="7">  
          <el-form-item  class="form-item" prop="typeId" label="知识类别：" label-width="60px">
            <el-tree-select
              v-model="props.knowledgeForm.value.typeId"
              :data="typeData"
              :props="treeTypeDataProps"
              :render-after-expand="false"
            />
          </el-form-item>
        </el-col> 
        
      </el-row>
      <el-row>
        <el-col :span="7">  
          <el-form-item  class="form-item" prop="submitterId" label="提交人：" label-width="80px">
            <el-select v-model="props.knowledgeForm.value.submitterId" placeholder="Select" style="width: 240px">
              <el-option
                v-for="item in userinfo"
                :key="item.id"
                :label="item.personname"
                :value="item.id"
              />
            </el-select>
          </el-form-item>
        </el-col>  
        <el-col :span="7">  
          <el-form-item  class="form-item" prop="reviewGroupId" label="审核组：" label-width="80px">
            <el-select v-model="props.knowledgeForm.value.reviewGroupId" @change="handleGroupChange"  placeholder="Select" style="width: 240px">
              <el-option
                v-for="item in reviewData"
                :key="item.id"
                :label="item.name"
                :value="item.id"
              />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="7">  
          <el-form-item  class="form-item" prop="reviewerId" label="审核人：" label-width="80px">
            <el-select 
              v-model="props.knowledgeForm.value.reviewerId" 
              placeholder="请选择审核人" 
              style="width: 240px"
              :disabled="!props.knowledgeForm.value.reviewGroupId"
              clearable
            >
              <el-option
                v-for="user in filteredReviewerData(props.knowledgeForm.value.reviewGroupId)"
                :key="user.userId"
                :label="user.personname"
                :value="user.userId"
              />
            </el-select>
          </el-form-item>
        </el-col>   
        <el-col :span="7">  
          <el-form-item  class="form-item" prop="status" label="知识状态：" label-width="80px">
             <el-select v-model="props.knowledgeForm.value.status"  placeholder="Select" style="width: 240px">
             <el-option
                v-for="item in statusData"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </el-select>

          </el-form-item>
        </el-col>  
        <!--<el-col :span="7">  
          <el-form-item  class="form-item" prop="publishedAt" label="发布时间：" label-width="80px">
            <el-date-picker
              v-model="props.knowledgeForm.value.publishedAt"
              type="datetime"
              placeholder="选择日期时间"
              format="YYYY-MM-DD HH:mm:ss"
              value-format="YYYY-MM-DD HH:mm:ss"
              :clearable="true"
            />
          </el-form-item>
        </el-col>-->
      </el-row>
      <!--<el-row>
        <el-col :span="7">
          <el-form-item class="form-item" prop="docPath" label="文档路径：" label-width="80px">
            <el-input v-model="props.knowledgeForm.docPath" autocomplete="off" />
          </el-form-item>
        </el-col>
      </el-row>-->
    </el-form>
    <div class="dialog-footer">
      <el-button @click="clear()">清空</el-button>
      <el-button type="primary" @click="submitForm">
        提交
      </el-button>
    </div>
</template>
<script setup>
import { defineProps, defineEmits,reactive, ref, onBeforeMount, toRefs, onMounted,computed,watch} from 'vue'
import {getDepartmentList} from "../../api/department.js"
import {getRolesList} from "../../api/roles.js"
// import {getAdList} from "../../api/ad.js"
import {base64Decode} from "../../utils/base64.js"
// import type { FormInstance, FormRules } from "element-plus"
import { ElForm, ElFormItem, ElInput, ElButton } from 'element-plus';
// 定义一个事件 'updateSubmit'，当表单提交时触发

const emit = defineEmits(['updateSubmit:knowledgeForm']);
// const userFormRef = ref<FormInstance>()
// 接收父组件传递的数据
const props = defineProps({
  knowledgeForm: Object,
  departmentdata: Array,
  typeData: Array,
  userinfo: Array,
  reviewData: Array,

});

const treeTypeDataProps = {
  label: 'typeName',
  value: 'id',
  children: 'children'
}
// const { knowledgeForm,typeData,userinfo,reviewData } = toRefs(props)
const knowledgeUpdateFormRef=ref()
const data=reactive({
  // 部门数据
  // departmentdata: [],
  // 角色数据
  rolesdata:[],
  // 知识提交人
  // 资产类型数据
  // 企微数据
  wechatdata: [],

  statusData: [
    {"value": 0,
    "label": "草稿"},
    {"value": 1,
    "label": "待审核"},
    {"value": 2,
    "label": "已发布"},
    {"value": 3,
    "label": "驳回"},
    {"value": 4,
    "label": "归档"},
  ]

})
const size=ref("small")

const {rules,rolesdata,addata,wechatdata,statusData}=toRefs(data)
const clear =()=>{
  props.userForm.password="",
  props.userForm.checkpass="",
  userFormRef.value.resetFields()
}

// 配置树的属性映射
const treeProps = ref({
  label: 'name',  // 显示节点的名称
  value: 'id',    // 使用 id 作为节点的值
  children: 'children'  // 使用 children 属性来表示子节点
});



// 提交
const submitForm = async () => {
  // const form = ref('userFormRef');
  knowledgeUpdateFormRef.value.validate((valid) => {
    if (valid) {
      console.log('提交成功', props.knowledgeForm);
      emit('updateSubmit',props.knowledgeForm)
    } else {
      console.log('表单验证失败');
    }
  });
};
/*const getDepartmentData=()=>{
      getDepartmentList().then((response)=>{
        const result = response.data.data
        if (result.departmentlist == '[]') {
                return [];
        } else {
            const base64String = result.departmentlist
            const decodedBytes = atob(base64String);
            // 将字节串转换为 Uint8Array
            const uint8Array = new Uint8Array(decodedBytes.split('').map(c => c.charCodeAt(0)));
            // 使用 TextDecoder 解码为字符串
            const decoder = new TextDecoder("utf-8");
            const decodedString = decoder.decode(uint8Array);
            console.log("departmentinfo===========+++++++++",decodedString)
            //window.localStorage.setItem("menus",decodedString)
            //const md5Hash = md5(decodedString+'menus_list');
            //window.localStorage.setItem("md5Hash",md5Hash)
            departmentdata=JSON.parse(decodedString)
            console.log("departmentinfo=======---------------------====+++++aaaaassssss++++",departmentdata)
            // 存储菜单数据到 localStorage
            // const decodedString = window.localStorage.getItem('menus');
            // 返回解析后的菜单数据
            return JSON.parse(decodedString);
        }
      })
  }
  */

// 根据选中的组，直接取对应 users
const filteredReviewerData =(id) => {
  const group = props.reviewData.find(item => item.id == id)
  console.log("================group 20250926===============",group)
  return group && group.users ? group.users : []
}

// 切换组时清空已选审核人
const handleGroupChange = () => {
  props.knowledgeForm.reviewerId = null
}
onMounted(()=>{
//  await getDepartmentData()
  // departmentdata = departmentlist
  // getRoleNames()
  // getAdNames()
  // console.log("departmentdata==========add==========",props.departmentdata)
})
onBeforeMount(()=>{
    console.log("=================20250928--------------",props.knowledgeForm.value)
  })
</script>
<style scoped>
.form-item{
  width: 300px;
  margin: 10px auto;
}
</style>
